<template>
  <div>
    用户名:<input type="text" v-model="adminname" /><br />
    密码:<input type="text" v-model="password" /><br />
    <button @click="login">登录</button>
  </div>
</template>

<script>
import { mapMutations } from 'vuex'
import axios from 'axios'
// 设置基准路径
axios.defaults.baseURL = 'http://huangjiangjun.top:3001/admin'

// 响应拦截器
axios.interceptors.response.use(
  function (response) {
    // 对响应数据做点什么
    // 相当于只是把响应体数据，返回给页面
    return response.data
  },
  function (error) {
    // 对响应错误做点什么
    return Promise.reject(error)
  }
)
export default {
  data () {
    return {
      adminname: 'admin',
      password: '123456'
    }
  },
  methods: {
    async login () {
      const res = await axios({
        url: 'admin/login',
        method: 'POST',
        data: {
          adminname: this.adminname,
          password: this.password
        }
      })

      //   console.log('--res--', res)
      // 说明一下，这里暂时不处理登录错误的情况
      //   console.log(this.$store)
      // this.$store.commit('user/setToken', res.data.token)

      // 调用自己的方法
      this.setToken(res.data.token)
    },
    /**
     * 参数1：模块的名字
     * 参数2：数组，因为将来可能有多个
     */
    ...mapMutations('user', ['setToken'])
  }
}
</script>
